<template>
  <!-- div -->
  <div class="aa">
    <div id="qq">
      <div class="qq1">
        <div class="qq2">
          <div class="qq3">
            <img src="../assets/首页_slices/打造前程标志(1).jpg" />
          </div>
          <div class="qq4">
            <div class="dropdown">
              <button class="dropbtn">集团产业</button>
              <div class="dropdown-content">
                <router-link to="/Home">金融模块</router-link>
                <router-link to="/KeJi">科技模块</router-link>
                <router-link to="/DianShang">电商模块</router-link>
                <router-link to="/ZhiJiao">职教模块</router-link>
                <router-link to="/YouJiao">幼教模块</router-link>
              </div>
            </div>
            <li>首页</li>
            <li><router-link to="/JtGk">集团概况</router-link></li>
            <li>集团产业</li>
            <li>
              <router-link to="/JtXw">集团新闻</router-link>
            </li>
            <li><router-link to="/LxWm">联系我们</router-link></li>
            <li><router-link to="/ZpXx">招聘信息</router-link></li>
          </div>
        </div>
        <div class="qq5">
          <p>打造前程集团</p>
          <div class="qq6">
            科技创新引领产业发展 <span>·</span> 产教融合共育技术人才
          </div>
        </div>
      </div>
    </div>
    <div class="xx">
      <div class="xx1">
        <div class="xx2">
          <p>最新资讯</p>
        </div>
        <div class="xx3">
          <li>集团新闻</li>
          <li>媒体报道</li>
          <li class="xx4">行业资讯</li>
        </div>
      </div>
      <div class="xx5">
        <div class="xx6">
          <div class="xx7">
            <img src="../assets/首页_slices/摄影图.jpg" />
          </div>
          <div class="xx8">
            <p>要让学生知道，努力学习是一种责任！</p>
            <h1>2021-05-30</h1>
            <li>
              中国心理学会法律心理学分会副会长、中国人民公安大学教授李玫瑾，同时也担任中国预防青少年犯罪研究会的副会长...
            </li>
          </div>
        </div>
        <div class="xx9">
          <p>发展数字经济 共享包容增长 为经济发展插上“数字翅膀”</p>
          <h3>2021-05-30</h3>
          <li>
            中国心理学会法律心理学分会副会长、中国人民公安大学教授李玫瑾，同时也担任中国预防青少年犯罪研究会的副会长...
          </li>
          <p>用系统思维下好“职业教育一盘大棋”</p>
          <h3>2021-05-30</h3>
          <li>
            中国心理学会法律心理学分会副会长、中国人民公安大学教授李玫瑾，同时也担任中国预防青少年犯罪研究会的副会长...
          </li>
          <p>我国将在全国实施动产和权利担保统一登记—拓融资渠道</p>
          <h3>2021-05-30</h3>
          <li>
            中国心理学会法律心理学分会副会长、中国人民公安大学教授李玫瑾，同时也担任中国预防青少年犯罪研究会的副会长...
          </li>
        </div>
      </div>
    </div>
    <div class="yy">
      <div class="yy1">
        <div class="yy2">
          <p>集团产业</p>
        </div>
        <div class="yy3">
          <li>更多 ></li>
        </div>
      </div>
      <div class="yy4">
        <div class="yy5">
          <div class="yy6">
            <div class="yy7">
              <img src="../assets/首页_slices/矩形(3).jpg" />
            </div>
            <div class="yy8">
              <p>金融产业</p>
              <h3>融资租赁 | 债券融资 | 信托 | 产业基金</h3>
            </div>
          </div>
          <div class="yy9">
            <div class="yy10">
              <img src="../assets/首页_slices/矩形(5).jpg" />
            </div>
            <div class="yy11">
              <p>电商产业</p>
              <h1>网店运营 ｜ 创业孵化 ｜ 垂直电商</h1>
            </div>
          </div>
        </div>

        <div class="yy12">
          <div class="yy13">
            <div class="yy14">
              <img src="../assets/首页_slices/矩形(6).jpg" />
            </div>
            <div class="yy15">
              <p>科技产业</p>
              <h2>教育信息化 | 云技术与应用 | 城市信息化</h2>
            </div>
          </div>
          <div class="yy16">
            <div class="yy17">
              <img src="../assets/首页_slices/矩形(7).jpg" />
            </div>
            <div class="yy18">
              <p>幼教产业</p>
              <h4>共建专业 | 订单式合作 | 共同项目研发 | 共建学院</h4>
            </div>
          </div>
        </div>

        <div class="yy19">
          <div class="yy20">
            <img src="../assets/首页_slices/蒙版(16).jpg" />
          </div>
          <div class="yy21">
            <p>职教产业</p>
            <h5>校企共建专业 | 校企共建二级学院 | 校企共建产业学院</h5>
          </div>
        </div>
      </div>
    </div>
    <div class="jj">
      <div class="jj1">
        <div class="jj2">
          <div class="jj3">
            <div class="jj4">
              <p>关于企业</p>
              <li>
                打造前程集团公司是一家集金融、科技、电商、职教、幼教等为一体的集团化公司。在国家“科教兴国，金融助力”的大政策背景下，通过创新金融产品助力产业升级及国民经济转型，促进社会可持续发展；以科技创新推进智慧建设，以电商创新平台带动区域经济特色发展，以产业带动专业建设，深化产业与教育深度融合，以教育助力国家现代化建设。集团公司秉承脚踏实地、志存高远的企业精神，落实内涵建设，坚持守正创新，通过校企合作共建专业、共建二级学院、共建附属幼教机构等模式，致力于让人才更有价值，让科技、教育惠及大众，走出了一条特色化的发展道路。
              </li>
            </div>
            <div class="jj5">
              <h1>了解更多</h1>
              <img src="../assets/矩形.png" />
            </div>
          </div>
          <div class="jj6">
            <div class="jj7"></div>
            <img src="../assets/首页_slices/22.jpg" />
          </div>
        </div>
        <div class="jj8">
          <div class="jj9">
            <div class="jj10">30</div>
            <div class="jj11">
              <span>+</span>
              <h1>全国校区</h1>
            </div>
            <div class="jj12">|</div>
          </div>
          <div class="jj13">
            <div class="jj14">10</div>
            <div class="jj15">
              <span>+</span>
              <h1>覆盖城市</h1>
            </div>
            <div class="jj16">|</div>
          </div>
          <div class="jj17">
            <div class="jj18">7000</div>
            <div class="jj19">
              <span>+</span>
              <h1>优秀讲师</h1>
            </div>
            <div class="jj20">|</div>
          </div>
          <div class="jj21">
            <div class="jj22">80</div>
            <div class="jj23">
              <span>+</span>
              <h1>服务学生</h1>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="hh">
      <div class="hh1">
        <div class="hh2">
          <div class="hh3">
            <div class="hh4">合作伙伴</div>
          </div>
          <div class="hh5">
            <div class="hh6">
              <div class="hh7">
                <img src="../assets/首页_slices/矩形(1).jpg" />
                <p>合作院校</p>
              </div>
            </div>
            <div class="hh8">
              <div class="hh9">
                <img src="../assets/企业.png" />
                <p>合作企业</p>
              </div>
            </div>
          </div>
          <div class="hh10">
            <div class="hh11"></div>
            <div class="hh12"></div>
          </div>
        </div>
        <div class="hh13">
          <div class="hh14" v-for="(aaa, index) in bbb" :key="'aaa' + index">
            <!-- aaa是value值 index代表下标 key值代表唯一值 bbb代表数组 -->
            <img :src="aaa.msg" />
          </div>
        </div>
      </div>
    </div>
    <div class="mm">
      <div class="mm1">
        <div class="mm2">
          <div class="mm3">
            <div>企业概况</div>
            <p>关于企业</p>
            <p>企业实力</p>
            <p>发展历程</p>
            <p>企业荣誉</p>
          </div>
          <div class="mm4">
            <div>集团产业</div>
            <p>金融板块</p>
            <p>科技板块</p>
            <p>电商板块</p>
            <p>职教板块</p>
            <p>幼教板块</p>
          </div>
          <div class="mm5">
            <div>企业新闻</div>
            <p>集团要闻</p>
            <p>公司新闻</p>
            <p>行业资讯</p>
          </div>
          <div class="mm6">
            <div>人力资源</div>
            <p>招聘信息</p>
          </div>
        </div>
        <div class="mm7">
          <div class="mm8">
            <img src="../assets/打造前程标志(1).png" />
            <h1>
              公司总部地址：郑州市金水区北三环文化路79号河南艺术职业学院
              邮箱：logo@163.com
            </h1>
          </div>
          <div class="mm9">
            <div class="mm10"><img src="../assets/位图.png" /></div>
            <h2>关注微信公众号</h2>
          </div>
        </div>
      </div>
      <div class="mm11">
        <div class="mm12"></div>
      </div>
      <div class="mm13">
        <div class="mm14">
          <h3>Copyright © xxxx有限公司 #网站备案号#</h3>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
// 组件
export default {
  name: "LoVe",
  data() {
    return {
      bbb: [
        {
          msg: require("../assets/首页_slices/蒙版(14).png"),
        },
        {
          msg: require("../assets/首页_slices/蒙版(13).png"),
        },
        {
          msg: require("../assets/首页_slices/蒙版(12).png"),
        },
        {
          msg: require("../assets/首页_slices/蒙版(11).png"),
        },
        {
          msg: require("../assets/首页_slices/蒙版(10).png"),
        },
        {
          msg: require("../assets/首页_slices/蒙版(9).png"),
        },
        {
          msg: require("../assets/首页_slices/蒙版(8).png"),
        },
        {
          msg: require("../assets/首页_slices/蒙版(7).png"),
        },
        {
          msg: require("../assets/首页_slices/蒙版(6).png"),
        },
        {
          msg: require("../assets/首页_slices/蒙版(5).png"),
        },
        {
          msg: require("../assets/首页_slices/蒙版(4).png"),
        },
        {
          msg: require("../assets/首页_slices/蒙版(3).png"),
        },
        {
          msg: require("../assets/首页_slices//蒙版(2).png"),
        },
        {
          msg: require("../assets/首页_slices/蒙版(1).png"),
        },
        {
          msg: require("../assets/首页_slices/蒙版.png"),
        },
      ],
    };
  },
};
</script>

<style>
/* 样式 */
.dropbtn {
  background: #ffffff;
  color: rgb(14, 13, 13);
  padding: 16px;
  font-size: 16px;
  border: none;
  cursor: pointer;
  position: absolute;
  left: 129px;
  width: 100px;
  top: -10px;
}
/* 容器 <div> - 需要定位下拉内容 */
.dropdown {
  position: relative;
  display: inline-block;
}
/* 下拉内容 (默认隐藏) */
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 100px;
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  left: 130px;
  top: 30px;
}
/* 下拉菜单的链接 */
.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}
/* 鼠标移上去后修改下拉菜单链接颜色 */
.dropdown-content a:hover {
  background-color: #f1f1f1;
}
/* 在鼠标移上去后显示下拉菜单 */
.dropdown:hover .dropdown-content {
  display: block;
}
/* 当下拉内容显示后修改下拉按钮的背景颜色 */

.qq {
  width: 1290px;
  height: 800px;
  /* border: 1px solid red; */
}
.qq1 {
  width: 1920px;
  height: 800px;
  background: url(../assets/首页_slices/蒙版.jpg);
  /* border: 1px solid red; */
  position: relative;
}
.qq2 {
  width: 80%;
  left: 10%;
  height: 101px;
  background: #ffffff;
  box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.1);
  border-radius: 51px;
  display: flex;
  position: absolute;
  /* border: 1px solid red; */
  top: 40px;
}
.qq3 {
  width: 181px;
  height: 54px;
  margin: 20px 100px;
  /* border: 1px solid red; */
}
.qq4 {
  display: flex;
  width: 580px;
  height: 22px;
  font-size: 16px;
  font-weight: 500;
  color: #000000;
  line-height: 22px;
  margin: 35px 0;
  margin-left: 370px;
  line-height: 15px;
  /* border: 1px solid red; */
  list-style-type: none;
  position: relative;
}
.qq4 li {
  padding: 10px;
}
.qq5 {
  width: 1200px;
  height: 300px;
  left: 15%;
  top: 300px;
  position: absolute;
  /* border: 1px solid red; */
}
.qq5 p {
  width: 1200px;
  height: 124px;
  margin: 0;
  margin-top: 50px;
  font-size: 90px;
  text-align: center;
  color: #ffffff;
}
.qq6 {
  width: 1200px;
  height: 27px;
  color: #ffffff;
  text-align: center;
  font-size: 20px;
  margin-top: 14px;
}
.abc span {
  margin: 0 20px;
}
.xx {
  width: 1920px;
  height: 730px;
  background: #f8f8f8;
  /* border: 1px solid red; */
}
.xx1 {
  width: 1920px;
  height: 125px;
  display: flex;
  /* border: 1px solid red; */
}
.xx2 {
  width: 470px;
  height: 125px;
  margin-left: 32px;
  /* border: 1px solid red; */
}
.xx2 p {
  width: 144px;
  height: 50px;
  font-size: 36px;
  font-weight: 600;
  color: #444444;
  line-height: 50px;
  margin-left: 320px;
}
.xx3 {
  width: 1450px;
  height: 125px;
  display: flex;
  justify-content: end;
  align-items: center;
  margin-left: 766px;
  /* border: 1px solid red; */
}
.xx3 li {
  width: 120px;
  height: 22px;
  font-size: 16px;
  font-weight: 400;
  color: #000000;
  line-height: 22px;
  list-style-type: none;
}
.xx4 {
  margin-right: 380px;
}
.xx5 {
  width: 1920px;
  height: 545px;
  display: flex;
  /* border: 1px solid red; */
}
.xx6 {
  width: 588px;
  height: 541px;
  background: #ffffff;
  margin: 0 512px 80px 356px;
  /* border: 1px solid red; */
}
.xx8 {
  /* width: 588px; */
  height: 180px;
  margin-left: 40px;
  /* border: 1px solid red; */
}
.xx8 p {
  width: 400px;
  height: 20px;
  font-size: 18px;
  font-weight: 500;
  color: #23337f;
  line-height: 25px;
}
.xx8 h1 {
  width: 170px;
  height: 20px;
  font-size: 14px;
  font-weight: 400;
  color: #8f8f8f;
  line-height: 20px;
}
.xx8 li {
  width: 507px;
  height: 30px;
  font-size: 14px;
  font-weight: 400;
  color: #666666;
  line-height: 28px;
  list-style-type: none;
  /* align-items: center; */
}
.xx9 {
  width: 588px;
  height: 541px;
  margin-left: -466px;
  background: #ffffff;
  /* border: 1px solid red; */
}
.xx9 p {
  width: 530px;
  height: 25px;
  font-size: 18px;
  font-weight: 500;
  color: #444444;
  line-height: 25px;
  margin-top: 32px;
  margin-left: 40px;
}
.xx9 h3 {
  width: 170px;
  height: 20px;
  font-size: 14px;
  font-weight: 400;
  color: #8f8f8f;
  line-height: 20px;
  margin-left: 40px;
}
.xx9 li {
  width: 507px;
  height: 56px;
  font-size: 14px;
  font-weight: 400;
  color: #666666;
  line-height: 28px;
  margin-left: 40px;
  list-style-type: none;
}
.yy {
  width: 1920px;
  height: 730px;
  /* border: 1px solid red; */
}
.yy1 {
  width: 1920px;
  height: 120px;
  display: flex;
  /* border: 1px solid red; */
}
.yy2 {
  width: 600px;
  height: 120px;
  margin-left: 48px;
  /* border: 1px solid red; */
}
.yy2 p {
  width: 144px;
  height: 50px;
  font-size: 36px;
  font-weight: 600;
  color: #444444;
  line-height: 50px;
  margin-left: 320px;
}
.yy3 {
  width: 1320px;
  height: 120px;
  margin-left: 142px;
  /* border: 1px solid red; */
}
.yy3 li {
  width: 48px;
  height: 22px;
  font-size: 16px;
  font-weight: 400;
  color: #999999;
  line-height: 22px;
  margin: 50px 360px 48px 875px;
  list-style-type: none;
}
.yy4 {
  width: 1920px;
  height: 610px;
  display: flex;
  /* border: 1px solid red; */
}
.yy5 {
  width: 386px;
  height: 546px;
  margin-left: 364px;
  /* border: 1px solid red; */
}
.yy6,
.yy9,
.yy13,
.yy16 {
  width: 386px;
  height: 284px;
  position: relative;
  /* border: 1px solid red; */
}
.yy8,
.yy11,
.yy15,
.yy18 {
  left: 32px;
  bottom: 34px;
  position: absolute;
}
.yy8 p,
.yy11 p,
.yy15 p,
.yy18 p,
.yy21 p {
  width: 96px;
  height: 18px;
  font-size: 24px;
  font-weight: 600;
  color: #ffffff;
  line-height: 33px;
  text-shadow: 0px 2px 6px rgba(0, 0, 0, 0.3);
}
.yy8 h3 {
  width: 337px;
  height: 22px;
  font-size: 14px;
  font-weight: 400;
  color: #ffffff;
  line-height: 20px;
}
.yy11 h1 {
  width: 337px;
  height: 22px;
  font-size: 14px;
  font-weight: 400;
  color: #ffffff;
  line-height: 20px;
}

.yy12 {
  width: 386px;
  height: 546px;
  margin-left: 32px;
  /* border: 1px solid red; */
}
.yy15 h2 {
  width: 337px;
  height: 22px;
  font-size: 14px;
  font-weight: 400;
  color: #ffffff;
  line-height: 20px;
}
.yy18 h4 {
  width: 337px;
  height: 22px;
  font-size: 14px;
  font-weight: 400;
  color: #ffffff;
  line-height: 20px;
}
.yy19 {
  width: 386px;
  height: 546px;
  margin-left: 32px;
  position: relative;
  /* border: 1px solid red; */
}
.yy21 {
  bottom: 10px;
  left: 32px;
  position: absolute;
}
.yy21 h5 {
  width: 337px;
  height: 22px;
  font-size: 14px;
  font-weight: 400;
  color: #ffffff;
  line-height: 20px;
}
.jj {
  width: 1920px;
  height: 856px;
  /* border: 1px solid red; */
}
.jj1 {
  width: 1920px;
  height: 856px;
  background: url("../assets/首页_slices/11.jpg");
  border: 1px solid white;
}
.jj2 {
  width: 1225px;
  height: 517px;
  margin-top: 98px;
  margin-left: 368px;
  display: flex;
  /* border: 1px solid red; */
}
.jj3 {
  width: 705px;
  height: 517px;
  /* border: 1px solid red; */
}
.jj4 {
  width: 600px;
  height: 390px;
  /* border: 1px solid red; */
}
.jj4 p {
  width: 160px;
  height: 50px;
  font-size: 36px;
  font-weight: 600;
  color: #ffffff;
  line-height: 50px;
}
.jj4 li {
  width: 600px;
  height: 280px;
  font-size: 16px;
  font-weight: 400;
  color: #ffffff;
  line-height: 40px;
  list-style-type: none;
}
.jj5 {
  width: 160px;
  height: 40px;
  display: flex;
  margin-top: 48px;
  border: 1px solid white;
}
.jj5 h1 {
  width: 64px;
  height: 22px;
  font-size: 16px;
  font-weight: 400;
  color: #ffffff;
  line-height: 22px;
  margin-left: 35px;
}
.jj6 {
  width: 520px;
  height: 517px;
  display: flex;
  /* border: 1px solid red; */
}
.jj7 {
  width: 33px;
  height: 408px;
  margin-top: 64px;
  background: #3491e5;
}
.jj8 {
  width: 1300px;
  height: 84px;
  margin-left: 310px;
  margin-left: 368px;
  margin-top: 62px;
  display: flex;
  /* border: 1px solid red; */
}
.jj9,
.jj13 {
  width: 500px;
  height: 84px;
  display: flex;
  /* border: 1px solid red; */
}
.jj10,
.jj14,
.jj22 {
  width: 77px;
  height: 84px;
  font-size: 60px;
  font-weight: 500;
  color: #ffffff;
  line-height: 84px;
}
.jj11,
.jj15,
.jj19,
.jj23 {
  width: 162px;
  height: 78px;
  /* border: 1px solid red; */
}
.jj11 span,
.jj15 span,
.jj19 span,
.jj23 span {
  width: 12px;
  height: 24px;
  font-size: 17px;
  font-weight: 400;
  color: #ffffff;
  line-height: 24px;
  margin-left: 11px;
  margin-top: 10px;
}
.jj11 h1,
.jj15 h1,
.jj19 h1,
.jj23 h1 {
  width: 86px;
  height: 28px;
  font-size: 20px;
  font-weight: 500;
  color: #ffffff;
  line-height: 28px;
  margin-left: 11px;
}
.jj12,
.jj16,
.jj20 {
  width: 1px;
  height: 80px;
  border: 1px solid #eaeaea;
}
.jj17 {
  width: 612px;
  height: 84px;
  display: flex;
  /* border: 1px solid red; */
}
.jj18 {
  width: 146px;
  height: 84px;
  font-size: 60px;
  font-weight: 500;
  color: #ffffff;
  line-height: 84px;
  /* border: 1px solid red; */
}
.jj21 {
  width: 300px;
  height: 84px;
  display: flex;
  /* border: 1px solid red; */
}
.hh {
  width: 1920px;
  height: 800px;
  /* border: 1px solid red; */
}
.hh1 {
  width: 1920px;
  height: 798px;
  background: url("../assets/首页_slices/33.jpg");
}
.hh2 {
  width: 1920px;
  height: 245px;
  /* border: 1px solid red; */
}
.hh3 {
  width: 1920px;
  height: 130px;
  border: 1px solid rgb(255, 255, 255);
}
.hh4 {
  width: 144px;
  height: 50px;
  font-size: 36px;
  font-weight: 600;
  color: #444444;
  line-height: 50px;
  margin-top: 80px;
  margin-left: 888px;
  /* border: 1px solid red; */
}
.hh5 {
  width: 1920px;
  height: 86px;
  display: flex;
  /* border: 1px solid red; */
}
.hh6 {
  width: 929px;
  height: 86px;
  /* border: 1px solid red; */
}
.hh7 {
  width: 154px;
  height: 40px;
  display: flex;
  margin-left: 774px;
  margin-top: 40px;
  /* border: 1px solid red; */
}
.hh7 p {
  width: 96px;
  height: 33px;
  font-size: 24px;
  font-weight: 400;
  color: #23337f;
  line-height: 33px;
  margin-left: 16px;
  margin-top: 10px;
}
.hh8 {
  width: 924px;
  height: 86px;
  /* border: 1px solid red; */
}
.hh9 {
  width: 154px;
  height: 40px;
  display: flex;
  margin-top: 40px;
  margin-left: 68px;
  /* border: 1px solid red; */
}
.hh9 p {
  width: 96px;
  height: 33px;
  font-size: 24px;
  font-weight: 400;
  color: #666666;
  line-height: 33px;
  margin-left: 16px;
  margin-top: 10px;
}
.hh10 {
  width: 1920px;
  height: 29px;
  /* border: 1px solid red; */
}
.hh11 {
  width: 160px;
  height: 2px;
  margin-top: 22px;
  margin-left: 776px;
  background: #23337f;
}
.hh12 {
  width: 1200px;
  height: 1px;
  margin-top: 2px;
  margin-left: 360px;
  border: 1px solid #e5e7ef;
}
.hh13 {
  width: 1200px;
  height: 430px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 40px auto;
  /* border: 1px solid red; */
}
.hh14 {
  width: 227px;
  height: 120px;
  background: #ffffff;
  box-shadow: 0px 0px 12px -2px rgba(0, 0, 0, 0.12);
  border-radius: 9px;
}
.mm {
  width: 1920px;
  height: 385px;
  background: #17213d;
}
.mm1 {
  width: 1920px;
  height: 276px;
  display: flex;
  /* border: 1px solid red; */
}
.mm2 {
  width: 640px;
  height: 276px;
  display: flex;
  margin-left: 282px;
  /* border: 1px solid red; */
}
.mm3,
.mm4,
.mm5,
.mm6 {
  width: 64px;
  height: 190px;
  margin-left: 72px;
  margin-top: 77px;
  /* border: 1px solid red; */
}
.mm3 div,
.mm4 div,
.mm5 div,
.mm6 div {
  width: 64px;
  height: 22px;
  font-size: 16px;
  font-weight: 500;
  color: #dddddd;
  line-height: 22px;
}
.mm3 p,
.mm4 p,
.mm5 p,
.mm6 p {
  width: 56px;
  height: 0px;
  font-size: 14px;
  font-weight: 400;
  color: #999999;
  line-height: 20px;
  margin-top: 32px;
}
.mm7 {
  width: 1030px;
  height: 276px;
  display: flex;
  /* border: 1px solid red; */
}
.mm8 {
  width: 467px;
  height: 156px;
  margin-top: 70px;
  /* border: 1px solid red; */
}
.mm8 h1 {
  width: 467px;
  height: 64px;
  font-size: 16px;
  font-weight: 400;
  color: #ffffff;
  line-height: 32px;
  margin-top: 38px;
}
.mm9 {
  width: 111px;
  height: 139px;
  margin-left: 70px;
  margin-top: 79px;
  /* border: 1px solid red; */
}
.mm9 h2 {
  width: 98px;
  height: 20px;
  font-size: 14px;
  font-weight: 400;
  color: #ffffff;
  line-height: 20px;
  margin-left: 8px;
}
.mm10 {
  width: 111px;
  height: 109px;
  border: 1px solid #979797;
}
.mm10 img {
  margin: 7px 8px 7px 8px;
}
.mm11 {
  width: 1920px;
  height: 8px;
  /* border: 1px solid red; */
}
.mm12 {
  width: 1280px;
  height: 1px;
  background: #444444;
  margin-top: 36px;
  margin-left: 320px;
}
.mm13 {
  width: 1920px;
  height: 62px;
  /* border: 1px solid red; */
}
.mm14 {
  width: 413px;
  height: 35px;
  margin-left: 321px;
  margin-bottom: 21px;
  /* border: 1px solid red; */
}
.mm14 h3 {
  width: 413px;
  height: 17px;
  font-size: 12px;
  font-weight: 400;
  color: #a3a3a3;
  line-height: 60px;
}
</style>